<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>Example of ui-dialogbox 1.0.x</title>
<style type="text/css">
.dialogbox {
	width: 500px;
	height: 300px;
	background: gray;
	position: absolute;
	visibility: hidden;
	overflow: hidden;
}
	.dialogbox .ui-draggable-trigger {
		background: green;
		color: #fff;
		overflow: hidden;
		height: 30px;
		line-height: 30px;
	}
		.dialogbox .ui-draggable-trigger .ui-dialogbox-close { float: right; }
</style>
</head>

<body>
<div id="toggle">点击显示</div>
<div id="dialogbox" class="dialogbox">
	<div class="ui-draggable-trigger">
		<span class="ui-dialogbox-close">关闭</span>
		点击此处开始拖动
	</div>
</div>
<div style="height: 2000px;"></div>
<script src="../../../jraiser2-debug.js"></script>
<script src="../../config.js"></script>
<script>
require(['dom/1.0.x/', 'dialogbox/1.0.x/'], function($, Dialogbox) {

var dialogbox = new Dialogbox({
	wrapper: $('#dialogbox'),
	animation: {
		duration: 220
	}
});

$('#toggle').click(function() {
	dialogbox.popup();
});

});
</script>
</body>
</html>